var QuerySummary = function () {
  var template = /* html */ `
    <div class="query-summary" v-loading.fullscreen.lock="loading">
      <search-btn-view immediate btn-text="出入库汇总查询" @before-open="resetSearch" @search="searchData">
        <div slot="search-content">
          <summary-search-form :search="search"></summary-search-form>
        </div>
      </search-btn-view>

      <div class="query-summary-table-div">
        <el-table fit stripe border :data="summaryList" style="width:100%;" height="parent">
          <el-table-column sortable :resizable="false" prop="providerName" label="供应商" :auto-width="true" min-width="80px"
            header-align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="materialName" label="物料名称" :auto-width="true" min-width="90px"
            header-align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="color" label="编号" :auto-width="true" min-width="70px"
            header-align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="colorDescription" label="描述" :auto-width="true" min-width="90px"
            header-align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="model" label="规格" :auto-width="true" min-width="70px"
            header-align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="materialDeptName" label="物料部门" :auto-width="true" min-width="110px"
            align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="providerNo" label="供方编号" :auto-width="true" min-width="90px"
            header-align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="inCount" label="入库数" min-width="120px" align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="outCount" label="出库数" min-width="120px" align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="startCount" label="期初库存数" min-width="120px" align="center"></el-table-column>
          <el-table-column sortable :resizable="false" prop="endCount" label="期末库存数" min-width="120px" align="center"></el-table-column>
        </el-table>
      </div>

      <table-pagination v-if="pagination.totalCount!==0" :pagination="pagination" @change="pageChange"></table-pagination>
    </div>
  `;

  return {
    mixins: [
      tablePaginationMixin()
    ],
    data: function () {
      var search = {
        materialName: '',
        model: '',
        color: '',
        providerName: '',
        materialDept:'',
        startDate: moment().subtract(1, 'month').valueOf(),
        endDate: moment().valueOf(),
        warehouseType: '',
        type: '',
        providerNo:''
      };
      return {
        loading: false,
        search: _.cloneDeep(search),
        oldSearch: _.cloneDeep(search),
        summaryList: []
      };
    },

    methods: {
      setSummaryList: function (isSearch) {
        if (!isSearch) {
          this.search = _.cloneDeep(this.oldSearch);
        }

        var pagination = this.pagination;
        var currentPage = pagination.currentPage;
        var pageSize = pagination.pageSize;
        var start = (currentPage - 1) * pageSize;
        var postData = {
          start: start,
          length: pageSize
        };

        var search = this.search;
        var fields = ['materialName', 'model', 'color', 'providerName', 'warehouseType','providerNo'];
        SysUtil.setPostData(postData, search, fields);

        var materialDept = search.materialDept;
        if (materialDept !== '') {
          postData.materialDeptId = materialDept.materialDeptId;
        }

        if (search.startDate !== null) {
          postData.startDate = moment(search.startDate).format('YYYY-MM-DD');
        }
        if (search.endDate !== null) {
          postData.endDate = moment(search.endDate).format('YYYY-MM-DD');
        }

        this.loading = true;
        var self = this;
        ajaxRequest("warehouse/getInOutSummary", postData, false).then(function (res) {
          if (isSearch) {
            self.oldSearch = _.cloneDeep(self.search);
          }

          var summaryList = res.returnData;
          for (var i = 0; i < summaryList.length; i++) {
            var summary = summaryList[i];
            SysUtil.tableSetDeptData(summary);
          }

          self.summaryList = res.returnData;
          self.pagination.totalCount = res.iTotalRecords;
          self.loading = false;
        }).catch(function(){
          self.loading = false;
        });
      },

      resetSearch: function () {
        this.search = _.cloneDeep(this.oldSearch);
      },

      searchData: function () {
        this.pagination.currentPage = 1;
        this.setSummaryList(true);
      },

      pageChange:function(){
        this.setSummaryList();
      }
    },

    components: {
      SearchBtnView: SearchBtnView,
      SummarySearchForm: SummarySearchForm
    },

    template: template
  };
}();